<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>sss</title>
<style type="text/css">
.nav{padding:0;margin:0;list-style: none;}
.nav .item { margin: 0; padding: 0; float: left; height: 35px; line-height: 35px; white-space: nowrap; float: left; background: #222;}
.nav .item a { color: #ddd; display: block; padding: 0 15px; text-decoration: none; } 
.nav .item a:hover {color: #2faadd;}

.nav .item:hover { position: relative; } 
.nav .item:hover>.nav { display: block; }

.nav .nav { top: 100%; left: 0; display: none; background: #444; position: absolute; border: solid 1px #888; }
.nav .nav .item { clear: both; min-width: 100%; } 
.nav .nav .nav { top: -1px; left: 100%; } 
.nav .nav .nav .nav .nav .nav {  left: auto;  right: 100%;}
</style>
</head>
<body>
	<ul class="nav">
		<li class="item"><a href="#">一级菜单</a>
			<ul class="nav">
				<li class="item"><a>一级+1</a></li>
				<li class="item"><a>一级+1</a></li>
				<li class="item"><a>一级+1</a></li>
				<li class="item"><a>一级+1</a>
					<ul class="nav">
						<li class="item"><a>一级+1</a></li>
						<li class="item"><a>一级+1</a></li>
						<li class="item"><a>一级+1</a></li>
						<li class="item"><a>一级+1</a>
							<ul class="nav">
								<li class="item"><a>一级+1</a></li>
								<li class="item"><a>一级+1</a></li>
								<li class="item"><a>一级+1</a></li>
								<li class="item"><a>一级+1</a></li>
								<li class="item"><a>一级+1</a>
									<ul class="nav">
										<li class="item"><a>一级+1</a></li>
										<li class="item"><a>一级+1</a></li>
										<li class="item"><a>一级+1</a></li>
										<li class="item"><a>一级+1</a></li>
										<li class="item"><a>一级+1</a>
											<ul class="nav">
												<li class="item"><a>一级+1</a></li>
												<li class="item"><a>一级+1</a></li>
												<li class="item"><a>一级+1</a></li>
												<li class="item"><a>一级+1</a></li>
												<li class="item"><a>一级+1</a>
													<ul class="nav">
														<li class="item"><a>一级+1</a></li>
														<li class="item"><a>一级+1</a></li>
														<li class="item"><a>一级+1</a></li>
														<li class="item"><a>一级+1</a></li>
														<li class="item"><a>一级+1</a>
															<ul class="nav">
																<li class="item"><a>一级+1</a></li>
																<li class="item"><a>一级+1</a></li>
																<li class="item"><a>一级+1</a></li>
																<li class="item"><a>一级+1</a></li>
																<li class="item"><a>一级+1</a>
																	<ul class="nav">
																		<li class="item"><a>一级+1</a></li>
																		<li class="item"><a>一级+1</a></li>
																		<li class="item"><a>一级+1</a></li>
																		<li class="item"><a>一级+1</a></li>
																		<li class="item"><a>一级+1</a>
																			<ul class="nav">
																				<li class="item"><a>一级+1</a></li>
																				<li class="item"><a>一级+1</a></li>
																				<li class="item"><a>一级+1</a></li>
																				<li class="item"><a>一级+1</a></li>
																			</ul></li>
																	</ul></li>
															</ul></li>
													</ul></li>
											</ul></li>
									</ul></li>
							</ul></li>
					</ul></li>
			</ul></li>
		<li class="item"><a href="#">一级菜单1</a></li>
		<li class="item"><a href="#">一级菜单2</a></li>
		<li class="item"><a href="#">一级菜单3</a></li>
		<li class="item"><a href="#">一级菜单4</a></li>
	</ul>
</body>
</html>